<template>
  <div>
     <!-- 顶部 -->
    <van-nav-bar
      v-for="(item, index) in songDtails"
      :key="index"
      :title="title"
      left-text="返回"
      left-arrow
      @click-left="onClickLeft"
      @click-right="onClickRight"
    />
      <van-field
        ref="username"
        v-model="username"
        label="用户名："
        placeholder="请输入用户名"
      />
      <van-field
        ref="password"
        v-model="password"
        label="密码："
        placeholder="请输入密码"
      />
    
    <button @click="login">登录</button>
    <button @click="logoutBtn">退出登录</button>
    <div>{{userName}}</div>
    <!-- 底部 -->
    <indexFooter></indexFooter>
  </div>
</template>
<script>
import { login,userInfo,logout } from "../api/api";
import indexFooter from "../components/IndexFooter.vue"
export default {
  name: "mine",
  components:{
    indexFooter
  },
  data() {
    return {
      tel: "",
      password: "",
      username: "",
      userName:""
    };
  },
  created() {
    userInfo().then((res) => {
      console.log(res);
      this.userName=res.userName
    });
  },
  methods: {
    login() {
      console.log(445);
      console.log(this.username);
      login(this.username, this.password).then((res) => {
        if (res.code == 0) {
          console.log(34);
          console.log(res);
          this.$router.push({ path: "/index" });
          this.$store.commit("changeLogin", {
            isLogin: true,
            userInfo: res.data,
          });
        } else {
          //   Toast("账号或密码错误");
        }
      });
    },
    // 退出登录
    // 退出登录
    logoutBtn() {
      logout().then((res) => {
        console.log(res);
        // Toast("退出成功");
        // this.flag=true;
        // this.$router.push("/login")
        this.$store.commit("changeLogin", { isLogin: false, userInfo: "" });
      });
    },
    onClickLeft() {
      window.history.go(-1);
    },
    onClickRight() {
      //   Toast("按钮");
    },
  },
};
</script>
